<!DOCTYPE html>
<html lang="en" class="no-js" xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout"
	layout:decorator="layout">
<head>
<title>哗啦啦</title>
</head>
<body>
	<div layout:fragment="content">
		<div class="col-md-12">
			<div class="area game">
				<div class="top1">
					<div class="col-md-3"></div>
					<div class="col-md-6">
						<div  th:replace="game/gamehead"></div>
					</div>
					<div class="col-md-3"></div>
				</div>
				<div class="blank"></div>
				<div
					style="border: 1px solid #ccc; border-radius: 4px; padding: 5px;">
					<div class="top2" th:include="game/gamesubhead"></div>
					<div class="blank"></div>
					<div class="top3">
						<table border="0" width="100%">
							<tr>
								<td align="left">今日盈亏：<span class="money_bg" th:text="${gain}">0</span>&nbsp;
									参与：<span id="ContentPlaceHolder1_ContentPlaceHolder1_Label1"
									th:text="${total_participate}">0</span>期&nbsp; 胜率：<font
									class="l1" th:text="${winning+'%'}">0%</font>&nbsp;&nbsp;
									 <input type="hidden" id="to_be_lottery_time"
									th:value="${to_be_lottery_time}" />
									<input type="hidden" id="serverTime" th:value="${serverTime}"/>
								</td>
								<td>
									<div class="tdl">
										<table align="right">
											<tr>
												<td width="1">&nbsp;</td>
												<td><a href="javascript:refreshsi();" class="s1">关自动刷新</a>
													<a href="javascript:refreshsi();" class="s2"
													style="display: none;">开自动刷新</a></td>
												<td><a href="javascript:setsound();" class="y1">关开奖音</a>
													<a href="javascript:setsound();" class="y2"
													style="display: none;">开开奖音</a></td>
												<td><a th:href="@{'/fgame/'+${game.id}+'/trendchart?num=100'}" class="z1" target="_blank">走势图</a></td>
											</tr>
										</table>
									</div>
								</td>
							</tr>
							<tr >
								<td align="left">
									 <span
									id="topTime">离 <font id="timeIssue" class="l1"
										th:text="${to_be_lottery}">10113328</font> 期开奖还有<font
										id="timeSec" class="sec"></font>秒
								</span>
								</td>
								<td align="right">
											<div style="display:inline;height:50px;" class="dataTables_paginate paging_bootstrap">
											
												<ul class="pagination" style="visibility: visible;">
													<li>
														<span th:text="${(periods.number+1)+'/'+periods.totalPages}"></span>
													</li>
													<li class="prev" th:classappend="${!periods.hasPrevious()}? 'disabled'"><a  th:if="${periods.hasPrevious()}" href="#" title="Prev"  th:href="${'/fgame/'+game.id+'/index'+'?page='+(periods.number-1)}"><i class="fa fa-angle-left">&lt;</i></a></li>
													<li th:each="pageNumber : ${periods.pageNumberList}" th:classappend="${pageNumber == periods.number}? 'active'">
														<a href="#" th:href="${'/fgame/'+game.id+'/index'+'?page='+pageNumber}" th:text="${pageNumber+1}">1</a>
													</li>
													<li class="next" th:classappend="${!periods.hasNext()}? 'disabled'"><a href="#" title="Next" th:if="${periods.hasNext()}" th:href="${'/fgame/'+game.id+'/index'+'?page='+(periods.number+1)}"><i class="fa fa-angle-right">&gt;</i></a></li>
												</ul>
											</div>
								</td>
							</tr>
						</table>
					</div>
					<div>
						<table
							class="table table-striped table-bordered  table-advance table-hover"
							style="border-style: None;">
							<tr>
								<th style="width: 80px;">期数</th>
								<th style="width: 130px;">截止时间</th>
								<th>游戏结果</th>
								<th style="width: 64px;padding:8px 0px;">已投注数</th>
								<th style="width: 142px;">游戏数额</th>
								<th style="width: 64px;padding:8px 0px;">中奖人数</th>
								<th style="width: 196px;">(我的)中奖/金币</th>
								<th style="width: 60px;">参与</th>
							</tr>
							<tr class="odd gradeX" th:each="gp:${periods}">
								<td th:text="${gp.period}"></td>
								<td th:text="${#dates.format(gp.lotteryTime,'MM-dd HH:mm:ss')}"></td>
								<th:block
									th:if="${gp.state.description == '未开奖'|| gp.deleted == true }">
									<td>-</td>
								</th:block>
								<th:block
									th:if="${gp.state.description != '未开奖' &amp;&amp; gp.deleted == false}">
									<th:block th:if="${game.id == 4}">
										<td>
											<div class='pk10numtd'>
												<div th:each="data:${gp.resultFromNumbers_arr}" th:style="${dataStat.index == 0?'border:2px solid #0D9B17;':''}" th:class="${'pk10n'+data}"></div>
											</div>
										</td>
									</th:block>
									
									<th:block th:unless="${game.id ==4}">
										<td>
											<div class='com1td xy28'>
												<th:block th:each="data:${gp.resultFromNumbers_arr}">
													<th:block th:if="${dataStat.index != (game.repeatTimes-1)}">
														<div th:class="${game.id==1?'xy28div1':'saizi'}" th:classappend="${(game.id==1?'gamean':'gamecn')+data}"></div>
														<div class="icon">+</div>
													</th:block>
													<th:block th:if="${dataStat.index == (game.repeatTimes-1)}">
														<div th:class="${game.id==1?'xy28div1':'saizi'}" th:classappend="${(game.id==1?'gamean':'gamecn')+data}"></div>
														<div class="icon">=</div>
													</th:block>
												</th:block>
												<div class="xy28div2"
													th:classappend="${'gamebn'+gp.resultNumber}"></div>
												<div class="clearBoth"></div>
											</div>
										</td>
									</th:block>
								</th:block>
								<td th:text="${gp.bettingUserNumber}"></td>
								<td class="money money_bg" style="text-align: center;" th:text="${gp.totalMoney}"></td>
								<td>
								<a th:href="@{'/fgame/'+${game.id}+'/lotteryUsers?period='+${gp.period}}" class="winuser" th:text="${gp.winnerNumbers}">0</a>
								</td>
								<td th:text="${gp.singleUserBetMoney+'|'+gp.singleUserWinMoney}"></td>
								<th:block
									th:if="${gp.state.description == '未开奖'&amp;&amp; gp.deleted == false &amp;&amp;gp.singleUserBetMoney == 0}">
									<td class="actionbt"><a class="sb1" th:href="@{'/fgame/'+${game.id}+'/mannualBet?period='+${gp.period}}">投注</a></td>
								</th:block>
								<th:block
									th:if="${gp.state.description == '未开奖'&amp;&amp; gp.deleted == true}">
									<td>未开奖</td>
								</th:block>
								<th:block
									th:if="${gp.state.description != '未开奖'&amp;&amp; gp.deleted == false}">
									<td class="actionbt"><a th:href="@{'/fgame/'+${game.id}+'/lotteryResult?period='+${gp.period}}">已开奖</a></td>
								</th:block>
								<th:block th:if="${gp.state.description == '未开奖' &amp;&amp;gp.deleted == false &amp;&amp;gp.singleUserBetMoney != 0}">
									<td>已投注</td>
								</th:block>
							</tr>
						</table>
					</div>
					<div id="sound"></div>
				</div>
			</div>
		</div>
<script th:inline="javascript" type="text/javascript">
	function play(c) {
		$('#sound').html('<video src="/msg.mp3" autoplay="autoplay" style="display:none;" controls="controls">您的浏览器不支持 video 标签.</video>');
	}
	var refresh = getCookie('refreshswitch');
	if (refresh == null || refresh == "") {
	    setCookie('refreshswitch', 1, 365);
	    refresh = 1;
	}
	
	if (refresh == 0) { $(".s2").css("display", "block"); $(".s1").css("display", "none"); }
	if (refresh == 1) { $(".s2").css("display", "none"); $(".s1").css("display", "block"); }
	var soundcok = getCookie('soundswitch');
	if (soundcok == null || soundcok == "") {
	    setCookie('soundswitch', 1, 365);
	    soundcok = 1;
	}
	
	if (soundcok == 0) { $(".y2").css("display", "block"); $(".y1").css("display", "none"); }
	if (soundcok == 1) { $(".y2").css("display", "none"); $(".y1").css("display", "block"); }
	
	var serverTime = $('#serverTime').val();
	var endTime = $('#to_be_lottery_time').val();
	var timeIssue2 = $('#timeIssue').html(); //期号
	var sec; //还剩秒数
	var timeFlag; //时间倒数对象
	var Rsec = 0;
	
	function SetRunTime() {
	    $("#timeSec").text(parseInt($("#timeSec").text()) - 1);
	    if (parseInt($("#timeSec").text()) == 0) {
	        window.clearInterval(timeFlag);
	        $("#topTime").html("正在开奖,请刷新页面...");
	        $("table tr td:contains(" + timeIssue2 + ")").parent().find("td:last").text("摇奖中");
	        if (refresh == 1) {
	            timeFlag = window.setInterval(FunRefresh, 1000);
	        }
	    }
	}
	function DoRunTime() {
	    if ($.fn.CompareTime(endTime, serverTime)) {
	        sec = $.fn.GetTimeCSecond(endTime, serverTime);
	        $("#timeSec").text(sec);
	        timeFlag = window.setInterval(SetRunTime, 1000);
	    } else {
	        $("#topTime").html("正在开奖,请刷新页面...");
	        if (refresh == 1) {
	            timeFlag = window.setInterval(FunRefresh, 1000);
	        }
	    }
	}
	function FunRefresh() {
	    Rsec += 1;
	    if (Rsec == 2) {
	    	if(soundcok == 1){
		        play('msg.mp3');
	    	}
	    }
	    if (Rsec == 4) {
	        window.location.href = window.location.href;
	    }
	}
	function refreshsi() {
	    if (refresh == 1) {
	        refresh = 0;
	        $(".s2").css("display", "block"); $(".s1").css("display", "none");
	    }
	    else {
	        refresh = 1;
	        $(".s2").css("display", "none"); $(".s1").css("display", "block");
	    }
	    setCookie('refreshswitch', refresh, 365);
	}
	function setsound() {
	    if (soundcok == 1) {
	        soundcok = 0;
	        $(".y2").css("display", "block"); $(".y1").css("display", "none");
	    }
	    else {
	        soundcok = 1;
	        $(".y2").css("display", "none"); $(".y1").css("display", "block");
	    }
	    setCookie('soundswitch', soundcok, 365);
	}
	DoRunTime();
</script>
	</div>
</body>
</html>